import React, { Component } from "react";

export default class Video extends Component {
  state = {
    list: [
      {
        id: 1,
        name: "1231这是第一个列表",
      },
      {
        id: 2,
        name: "123这是第二个列表",
      },
      {
        id: 3,
        name: "这是第三个列表",
      },
      {
        id: 4,
        name: "这是第四个列表",
      },
    ],
    val: "",
  };
  render() {
    return (
      <section>
        <div>
          <input
            value={this.state.val}
            type="text"
            onChange={(evt) => {
              this.setState({
                val: evt.target.value,
              });
            }}
          />
        </div>
        <div>
          {this.handleClick().map((item) => (
            <div key={item.id}>{item.name}</div>
          ))}
        </div>
      </section>
    );
  }
  handleClick = () => {
    return this.state.list.filter((item) => item.name.includes(this.state.val));
  };
}
